<template>
	<div class="page">
		<Head />
		<div class="mainBody">
			<div class="user routerView">
				<div class="leftMenu">
					<leftAside></leftAside>
				</div>
				<div class="rightView">
					<div class="messageCenter">
						<div class="card">
							<div class="cardTitle">
								<div>Hòm thư</div>
							</div>
							<div class="cardBody">
								<el-tabs v-model="activeName">
									<el-tab-pane label="Tin nhắn" name="first">
										<div @click="url('/user/messageContent')" class="msgBox grey" v-for="item in 5" :key="item">
											<div class="msgTitle flexB">
												<div class="flex"><span > Thông báo mới nhất </span>
													<div >Trang web chính thức của công ty</div>
												</div>
												<p >2021-11-15 16:51:50</p>
											</div>
											<div class="msgContent">★ Trang web chính th...</div>
										</div>
									</el-tab-pane>
									<el-tab-pane label="Thông báo" name="second">
										<div>
											<p class="noData"> Chưa có tin mới </p>
										</div>
									</el-tab-pane>
								</el-tabs>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</template>

<script>
	import Head from '@/components/Head.vue'
	import leftAside from '@/components/aside.vue'
	export default {
		components: {
			Head,
			leftAside
		},
		data() {
			return {
				activeName: 'first'
			};
		},
		methods: {
			url(url) {
				this.$router.push({
					path: url
				})
			},
		}
	}
</script>
